// 头部按钮
const deliaBox = document.querySelector('.header>div>.delia')
const carBox = document.querySelector('.header>div>.car')
const exitBox = document.querySelector('.header>div>.exit')




// 渲染
// 获取元素

const assorttopul = document.querySelector('.assort>.assorttop>.assorttopul')
const assortcenterul = document.querySelector('.assort> .assortcenter> .assortcenterul') 
const assortbottomul = document.querySelector('.assort>.assortbottom >.assortbottomul')
const assortase = document.querySelector('.assortase')
const assort = document.querySelector('.assort')


const select = document.querySelector('.assort>.word>select')
getCategoryList() 
async function getCategoryList() {
  const res = await pAjax({
    url: '/zz',
    data : 'category2_id=19&pk_campaign=spfl_a2_b0',
    dataType: 'json',
    method:'POST'
  })
  // const res = await pAjax({
  //   url: '/pp',
  //   data : 'key_word=%E5%9B%BE%E4%B9%A6%E6%9D%82%E5%BF%97&c=search02',
  //   dataType: 'json',
  //   method:'POST'
  // })
  console.log(res);
  let str = ''                                                                                            
  let a =''
  let b =''
  res.Data.Brands.forEach(item => {
    str += `<li class="ecsc" data-id="${item.id}">${ item.name }</li>`
   })
  res.Data.price_range.forEach(item => {
    a += `<li class="price" data-from_price="${item.from_price}" data-to_price="${item.to_price}">${ item.text }</li>`
   })
  res.Data.points_range.forEach(item => {
    b += `<li class="points" data-from_points="${item.from_points}" data-to_points="${item.to_points}">${ item.text }</li>`
   })
  assorttopul.innerHTML = str
  assortcenterul.innerHTML = a
  assortbottomul.innerHTML = b
}

const info = {
  page: 1,
  size: 12,
  brand_id :'',
  order_by: 0,
  order_key:'',
  from_points:'',
  to_points:'',
  from_price:'',
  to_price:''
}

assort.addEventListener('click', e => {
  e = e || window.event
  const target = e.target || e.srcElement
  if (target.className === 'ecsc') {
    for (var i = 0; i < assorttopul.children.length; i++) {
       assorttopul.children[i].classList.remove('active')
    }
  target.classList.add('active')
    info.brand_id = target.dataset.id
    info.page = 1
    getGoodsList()
  }
  if (target.className === 'price') {
    for (var i = 0; i <assortcenterul.children.length; i++) {
      assortcenterul.children[i].classList.remove('active')
    }
    target.classList.add('active')
    info.from_price = target.dataset.from_price
    info.to_price = target.dataset.to_price
    info.page = 1
    getGoodsList()
  }
  if (target.className === 'points') {
    for (var i = 0; i < assortbottomul.children.length; i++) {
       assortbottomul.children[i].classList.remove('active')
    }
    target.classList.add('active')
    info.from_points = target.dataset.from_points
    info.to_points = target.dataset.to_points
    info.page = 1
    getGoodsList()
  }
  if (target.className === 'exit') {
    for (var i = 0; i < assortase.children.length; i++) {
       assortase.children[i].classList.remove('active')
    }
    target.classList.add('active')
    info.order_by = target.dataset.order_by
    info.to_points = target.dataset.order_key
    info.page = 1
    getGoodsList()
  }
  if (target.className === 'prev') {
    if (info.page <= 1) return
    info.page--
    getGoodsList()
  }
  if (target.className === 'next') {
    info.page++
    getGoodsList()
  }
})

select.addEventListener('change', () => {
  info.size = select.value
  info.page = 1
  getGoodsList()
  
})


const ulbox = document.querySelector('.box>ul')
let res={}
getGoodsList()
async function getGoodsList() {
  // 3-1. 把 info 对象转换成 查询字符串
  const data = querystringify(info)

  // 3-2. 发送请求
   res = await pAjax({
    url: '/zz',
    data: '&category2_id=19&pk_campaign=spfl_a2_b0&category3_id=&request=&'+data,
    dataType: 'json',
    method : 'POST'
  })
  // console.log(res);
  let str = ''
  res.Data.product.forEach(item => {
        str +=  `
        <li class="li1 asd" ">
        <p class="img" data-id="${item.id}">
           <img class="li-img" src="https://ceair.oss-cn-shanghai.aliyuncs.com/image${item.picUrl}" alt="">
        </p>
        <p class="head">
            <a href="">${item.name}</a>
        </p>
        <p class="price">
            <span class="small">
                ￥
            </span>
            ${item.max_price}
        </p>
        <p class="maxPoint">
            最高可使用${item.max_point}积分
        </p>
        <p class="btn" data-good_id="${item.id}">
            <a>  
                加入购物车
                <i></i>
            </a>
        </p>
    </li>
        `

  })
    ulbox.innerHTML = str
}
  $(document).on("click",".img",function(){
    console.log(this)
    window.sessionStorage.setItem('Id', this.dataset.id)
    console.log(123)
    window.location.href = './detail.html'
  })

  //判断是否登录
  $(document).on("click",".btn",function(){
    console.log(123);
    const login = window.localStorage.getItem('login')
    if (!login) {
      window.localStorage.setItem('url', 'list')
      window.alert('您还没有登录,请登录后再来加入购物车! ^_^')
      window.location.href="./login.html"
      return
    }
    const good_id = $(this).attr("data-good_id")-0
    console.log(good_id)
    const cart_list = JSON.parse(window.localStorage.getItem('cart_list')) || []
    // 从渲染列表页的数组中找到 good_id 一样的一条数据
    const info = res.Data.product.find(item => item.id === good_id)
    console.log(res.Data.product[0].id)
    // 判断 cart_list 中是否已经存在 good_id 这一条数据
    const flag = cart_list.find(item => item.id === good_id)

    if (!flag) {
      info.buy_num = 1
      info.is_select = false
      cart_list.push(info)
    } else {
      flag.buy_num++
    }
    
    // 存起来
    window.localStorage.setItem('cart_list', JSON.stringify(cart_list))
    window.alert('加入购物车成功!')

    // if($(target).className === 'cart')
  })
  // console.log($("p-list"))
// $(document).on("click",".cart",()=>{
//   window.location.href="./cart.html"
// })
// console.log($('.cart'));

const cart=document.querySelector(".cart")
cart.addEventListener("click",function(){
  window.location.href="./cart.html"
})

  


